{% extends 'base_foot.html' %}
{#模板继承于base_foot#}

{% block head %}
    <script type="text/javascript" src="/static/js/register.js"></script>
    <script type="text/javascript">
	 $(function(){
    code_error=false;

	var error_password = false;
	var error_check_password = false;
	var error_check = false;
	var error_email = false;


	$('#pwd').blur(function() {
		check_pwd();
	});

	$('#cpwd').blur(function() {
		check_cpwd();
	});

	$('#email').blur(function() {
		check_email();
	});

	$('#email_code').blur(function() {
		check_email_code();
	});

	$('#allow').click(function() {
		if($(this).is(':checked'))
		{
			error_check = false;
			$(this).siblings('span').hide();
		}
		else
		{
			error_check = true;
			$(this).siblings('span').html('请勾选同意');
			$(this).siblings('span').show();
		}
	});


	function check_user_name(){
		var len = $('#username').val().length;

		if(len<5||len>20)
		{
			$('#username').next().html('输入5-20个字符的用户名');
			$('#username').next().show();
			error_name = true;

		}
		else
		{
			$.get('{% url "df_user:register_exist" %}?uname='+$('#username').val(),function(data){
                if (data.count >= 1) {
                    $('#username').next().hide();
                    error_name = false;
                }else{
                    $('#username').next().html('用户名不存在').show();
                    error_name = true;
                }
            });
        }
	}

	function check_pwd(){
		var len = $('#pwd').val().length;
		if(len<4||len>20)
		{
			$('#pwd').next().html('密码最少4位，最长20位');
			$('#pwd').next().show();
			error_password = true;
		}
		else
		{
			$('#pwd').next().hide();
			error_password = false;
		}
	}


	function check_cpwd(){
		var pass = $('#pwd').val();
		var cpass = $('#cpwd').val();

		if(pass!=cpass)
		{
			$('#cpwd').next().html('两次输入的密码不一致');
			$('#cpwd').next().show();
			error_check_password = true;
		}
		else
		{
			$('#cpwd').next().hide();
			error_check_password = false;
		}

	}

	function check_email_code(){
		var re=$('#email_code').val();
		if(re.length != 8)
		{
		    $('#email_code').next().html('你输入验证码格式不正确');
			$('#email_code').next().show();
			code_error = true;
		}
		if({{ error_code }}==1)
		{
            $('#email_code').next().html('验证码错误').show();
            code_error=true;
        }
	}
    function check_email(){
		var re = /^[a-z0-9][\w\.\-]*@[a-z0-9\-]+(\.[a-z]{2,5}){1,2}$/;
		if(!re.test($('#email').val()))
		{
		    $('#email').next().html('你输入的邮箱格式不正确');
			$('#email').next().show();
			error_email = true;
		}
		else
		{
			$.get('{% url "df_user:register_exist" %}?uemail='+$('#email').val(),function(data){
                if (data.email_count >= 1) {
                    $('#email').next().hide();
                    error_email = false;
                }else{
                    $('#email').next().html('该邮箱暂无注册').show();
                    error_email = true;
                }
            });
		}

	}

	$('#reg_form').submit(function() {
		check_user_name();
		check_pwd();
		check_cpwd();
		check_email()
		check_email_code();

		if(error_name == false && error_password == false && error_check_password == false && error_email == false && code_error == false && error_check == false)
		{
			return true;
		}
		else
		{
			return false;
		}

	});
});
    </script>
{% endblock head %}

{% block body %}
	<div class="register_con">
		<div class="l_con fl">
			<a class="reg_logo"><img src="/static/images/logo_banner2.png" style="width: 300px;height:100px;overflow: hidden;object-fit: cover;"></a>
			<div class="reg_slogan">跳蚤虽小五脏全，东西南北货物多</div>
			<div class="reg_banner"><img src="/static/images/register_banner.jpg" style="width: 250px;height:330px;overflow: hidden;object-fit: cover;margin-right: 20px;"></div>
		</div>

		<div class="r_con fr">
			<div class="reg_title clearfix">
				<h1>修改密码</h1>
				<a href="{% url "df_user:login" %}">登录</a>
			</div>
			<div class="reg_form clearfix">
				<form action="{% url "df_user:findpwdView" %}" id='reg_form' method="post">
                    {% csrf_token %}
				<ul>
					<li>
						<label>新密码:</label>
						<input type="password" name="pwd" id="pwd">
						<span class="error_tip">提示信息</span>
					</li>
					<li>
						<label>确认密码:</label>
						<input type="password" name="confirm_pwd" id="cpwd">
						<span class="error_tip">提示信息</span>
					</li>
{#                    <li>#}
{#						<label>邮箱:</label>#}
{#                        <input type="text" name="email" id="email">#}
{#                        <form action="{% url "df_user:sendEmailCode" %}" method="get">#}
{#                            {% csrf_token %}#}
{#                            <input type="button" class="send_code" value="获取验证码" onclick="settime(this)">#}
{#                        </form>#}
{#                        <em style="display: none" class="count">重新发送(60)</em>#}
{#                        <a class="send_code" href="{% url "df_user:sendEmailCode" %}" onclick="sendValidCode()">获取验证码</a>#}
{#						<input type="button" class="send_code" value="获取验证码" onclick="settime(this)">#}
{#                        <span class="error_tip">提示信息</span>#}
{#					</li>#}
                    <li>
						<label>验证码:</label>
						<input type="text" name="email_code" id="email_code">
						<span class="error_tip">提示信息</span>
					</li>
					<li class="agreement">
						<input type="checkbox" name="allow" id="allow" checked="checked">
						<label>同意《跳蚤市场使用协议》</label>
						<span class="error_tip2">提示信息</span>
					</li>
					<li class="reg_sub">
						<input type="submit" value="修改">
					</li>
				</ul>				
				</form>
                <form action="{% url "df_user:sendEmailCode" %}" method="post">
                    {% csrf_token %}
                    <ul class="code_check">
                        <li>
                            <label>邮箱:</label>
                            <input type="text" name="email" id="email">
{#                            <em style="display: none" class="count">重新发送(60)</em>#}
{#                            <a class="send_code" href="javascript:;" onclick="sendValidCode()">获取验证码</a>#}
{#                            <input type="submit" class="send_code" value="获取验证码" onclick="settime(this)">#}
                            <input type="submit" class="send_code" value="获取验证码">
                            <span class="error_tip">提示信息</span>
                        </li>
                    </ul>
                </form>
			</div>

		</div>

	</div>
    <script type="text/javascript">
{#  input样式  #}
var countdown=60;
function settime(obj) {
    if (countdown == 0) {
        obj.removeAttribute("disabled");
        obj.value="获取验证码";
        countdown = 60;
        return;
    } else {
        obj.setAttribute("disabled", true);
        obj.value="重新发送(" + countdown + ")";
        countdown--;
    }
    setTimeout(function() {
        settime(obj) }
        ,1000)
 }
$('.send_code').click(function () {
     if(check){
            $.ajax({
                type: 'POST',
                url: '/user/sendEmailCode/?uemail='+$('#email').val(),
                data:{
                    csrfmiddlewaretoken:$('[name="csrfmiddlewaretoken"]').val(),
                    email: $('#email').val()
                },
                success:function (ad) {
                    alert(ad.data)
                },

            })
         }else(alert('该邮箱暂未注册！'))
   })
{#a标签样式#}
{#function sendValidCode(){#}
{#    $('#errorNotice').html('');#}
{##}
{#    $.ajax({#}
{#        type: 'GET',#}
{#        dataType: "json",#}
{#        url: "{% url "df_user:sendEmailCode" %}",#}
{#        data: {#}
{#            ajaxMethod: "sendValidCodeNew",#}
{#            mtype: "2"#}
{#        },#}
{#        success: function(data){#}
{#            if (data.result > 0) {#}
{##}
{#            }#}
{#            else {#}
{#                $('#email_code').next().html('发送失败！');#}
{#			    $('#email_code').next().show();#}
{#            }#}
{#        },#}
{#        error: function(data){#}
{#            $('#email_code').next().html('发送失败！');#}
{#			$('#email_code').next().show();#}
{#        }#}
{#     });#}
{##}
{##}
{#    //60秒后重新发送#}
{#    var btnSend = $(".send_code");#}
{#    var msg = $('.count');#}
{#    btnSend.removeAttr('style').attr('style', 'display:none;');#}
{#    msg.removeAttr('style').attr('style', 'display:block');#}
{#    var left_time = 60;#}
{#    var tt = window.setInterval(function(){#}
{#        left_time = left_time - 1;#}
{#        if (left_time <= 0) {#}
{#            window.clearInterval(tt);#}
{#            msg.html('重新发送(60)');#}
{#            msg.removeAttr('style').attr('style', 'display:none;');#}
{#            btnSend.removeAttr('style').attr('style', 'display:block');#}
{#        }#}
{#        else {#}
{#            msg.html('重新发送(' + left_time + ')');#}
{#        }#}
{#    }, 1000);#}
{# }#}
</script>
{#  弹窗提示  #}
    {% if messages %}
    <script>
        {% for msg in messages %}
            alert('{{ msg.message }}');
        {% endfor %}
    </script>
    {% endif %}
{% endblock body %}